<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<div class="form-group" id="thumbnailUploadContainer" class="col-sm-10" style="float: left; margin-right: 50px;">
    <input id="articleImageFile" name="excelFile" type="file" class="form-control" style="width: 300px; display: inline;" />
    <input id="saveZipButton" type="button" style="width: 60px;height: 35px;" value="上传" />
</div>

<!--<script>
    //导入excel文件
    $("#saveZipButton").on('click', function(){
        var formData = new FormData();
        var name = $("#articleImageFile").val();
        formData.append("file",$("#articleImageFile")[0].files[0]);
        formData.append("name",name);//这个地方可以传递多个参数
        $.ajax({
            url :  "http://localhost:8080/excel_upload",
            type : 'POST',
            async : false,
            data : formData,
            // 告诉jQuery不要去处理发送的数据
            processData : false,
            // 告诉jQuery不要去设置Content-Type请求头
            contentType : false,
            beforeSend:function(){
                console.log("正在进行，请稍候");
            },
            success : function(responseStr) {
                if(responseStr=="01"){
                    alert("导入成功");
                }else{
                    alert("导入失败");
                }
            }
        });
    });
</script>-->

<!-- 1.文件选择框 -->
<input type="file" id="file01">
<!-- 2.上传文件按钮 -->
<button id="btnUpload">上传文件</button>
<div class="progress" style="width: 500px;margin: 15px 10px;">
    <!--bootstrap进度条-->
    <!-- <div class="progress-bar progress-bar-striped active" style="width: 0%" id="percent">0%</div> -->
    <table id="demo01"></table>
</div>

<!-- <img src="./img/loading.gif" style="display: none;" alt="" id="loading"> -->
<!-- 3.img标签，来选择上传文件后的图片 -->
<img src="" alt="" id="img" width="800">

<script>
    $('#btnUpload').on('click', function () {
        var files = $('#file01')[0].files[0];//文件对象
        var formData = new FormData();
        formData.append("file", files);  //上传一个files对象
        // formData.append("operatorId", operatorId);//需要上传的多个参数
        // console.log(files);
        var file_name = files['name'];//文件名称
        var index = file_name.lastIndexOf(".");
        if (index != -1) {
            file_format = file_name.substr(index + 1).toUpperCase();//文件格式后缀
            if (file_format != 'XLS' && file_format != 'XLSX') {
                alert("只能上传.xls和.xlsx类型的文件!");
            } else {
                $.ajax({
                    url: 'http://localhost:8080/excel/upload', //切换接口地址
                    dataType: "json",
                    type: "post",
                    data: formData,
                    processData: false,//不去处理发送的数据
                    contentType: false,//不去设置Content-Type请求头
                    error: function (res) {
                        alert(res.desc);
                        return;
                    },
                    success: function (res) {
                        alert(res.desc);
                        return;
                    }

                })



            }

        }


    });





</script>


</body>
</html>